import React from 'react';
import { Tooltip, Button, message } from 'antd';
import CommonList from '../../../components/CommonLists/list';
import services from '../../../services/api';

class UserList extends CommonList {
  constructor(props) {
    super(props);
    this.api = 'user';

    this.editButton = (record) => {
      return (
        <Button size='small' type='link' onClick={this.edit.bind(this, record, { title: '编辑' })}>
          编辑
        </Button>
      );
    };
    this.delButton = (record) => {
      return (
        <Button size='small' type='link' disabled onClick={this.delete.bind(this, record)}>
          删除
        </Button>
      );
    };
    this.unlockingButton = record => {
      return (
        <Button
          size='small'
          type='link'
          disabled={record.overtime_locked !== 2}
          onClick={this.unlocking.bind(this, record)}
        >
          解锁
        </Button>
      );
    };
    this.btnGroup = [this.editButton, this.delButton, this.unlockingButton];

    this.columns = [
      {
        title: '用户名',
        key: 'username',
        dataIndex: 'username',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '员工姓名',
        key: 'name',
        dataIndex: 'name',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '角色',
        key: 'roles',
        dataIndex: 'roles',
        render: (text, record) => {
          return (
            <Tooltip title={text.join(',')}>
              <div className='overflowtext'>{text.join(',')}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '渠道权限',
        key: 'app_ids',
        dataIndex: 'app_ids',
        render: (text, record) => {
          return (
            <Tooltip title={text && text.join(',')}>
              <div className='overflowtext'>{text && text.join(',')}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '邮箱',
        dataIndex: 'email',
        key: 'email',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '手机号',
        dataIndex: 'mobile',
        key: 'mobile',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '备注',
        dataIndex: 'remark',
        key: 'remark',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '创建者',
        dataIndex: 'create_by',
        key: 'create_by',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '创建时间',
        dataIndex: 'create_at',
        key: 'create_at',
        width: 150,
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div>{text}</div>
            </Tooltip>
          );
        },
      },
      // {
      //   title: '状态',
      //   key: 'status',
      //   render: record => {
      //     return record.status === 1 ? (
      //       <span>激活</span>
      //     ) : record.status === 0 ? (
      //       <span>待激活</span>
      //     ) : (
      //       <span>停用</span>
      //     );
      //   }
      // }
    ];
  }
  componentDidMount() {}
  // 删除时的参数
  getDeleteParam = (record) => {
    return { id: record.id };
  };
  unlocking = (record) => {
    services[this.api].unlocking({ user_id: record.id }).then(res => {
      if (res.code === 0) {
        this.props.queryList();
      } else {
        message.error(res.msg)
      }
    })
  }
}

export default UserList;
